<template>
<pre>
<code>
<slot></slot>
</code>
</pre>
</template>

<style lang="less">
    @import "~core/basic.less";
    @import "./vs.css";

    pre{
        padding: 0px !important;
        margin: 0px !important;
        box-shadow: @shadow-1;
    }

    code{
        padding: 0px !important;
        margin: 0px !important;
    }

</style>

<script>
import highlight from 'highlight.js/lib/highlight.js';
import highlightXML from 'highlight.js/lib/languages/xml';
import highlightCSS from 'highlight.js/lib/languages/css';
import highlightJavascript from 'highlight.js/lib/languages/javascript';

highlight.registerLanguage('xml', highlightXML);
highlight.registerLanguage('css', highlightCSS);
highlight.registerLanguage('javascript', highlightJavascript);

export default {
    mounted:function(){
        highlight.highlightBlock(this.$el);
    }
}
</script>